<?php echo $this->Html->script('Wechat.wxmenu');?>
<div class="ng-scope">  
	<div class="panel panel-default">
		<div class="panel-heading">
			菜单设计器 <span class="text-muted">编辑和设置公众号菜单, 必须自定义菜单权限。</span>
		</div>
		<?php //pr($menus)?>
		<div class="table-responsive panel-body">
			<form id = 'data_form'>
			<table id = 'wxmenu' class="table table-hover">
				<tbody class="designer ui-sortable">
				<?php foreach($menus['menu']['button'] AS $row){?>
					<tr class="hover ng-scope" ng-repeat="menu in menus">
						<td style="border-top:none;">
							<div class="parentmenu">
								<input type="text" class="form-control menu_title" style="display:inline-block;width:300px;" value = '<?php echo $row['name']?>'>
								<input type="hidden" class="menu_type"  value = 'url'/>
								<input type="hidden" class="menu_value"  value = 'value'/>
								<a href="javascript:;" class = 'bighandel' title="拖动调整此菜单位置" style="border-left:0;"><i class="fa fa-arrows"></i></a>
								<a href="javascript:;" onclick="emoji.f.showDialog(this)" title="添加表情"><i class="fa fa-github-alt"></i> 添加表情</a>
								<a href="javascript:;" onclick="wxmenu.f.setAction(this)" class = 'menu_action' title="设置此菜单动作"><i class="fa fa-pencil"></i> 设置动作</a>
								<a href="javascript:;" onclick="wxmenu.f.deleteMenu(this)" title="删除此菜单"><i class="fa fa-remove"></i> 删除</a>
								<a href="javascript:;" onclick="wxmenu.f.addSubMenu(this)" title="添加子菜单"><i class="fa fa-plus"></i> 添加子菜单</a>
							</div>
							<div class="designer sonmenu wxsondrag">
								<!-- subMenus -->
								<?php foreach($row['sub_button'] as $sub):?>
								<div style="margin-top:20px;padding-left:80px;" class="son_menu_item">
									<input type="text" class="form-control menu_title" style="display:inline-block;width:220px;" ng-model="sub.title" value = '<?php echo $sub['name']?>'>
									<input type="hidden" class="menu_type"  value = 'url'/>
									<input type="hidden" class="menu_value"  value = 'value'/>
									<a href="javascript:;" class = 'smallhandel' title="拖动调整此菜单位置" style="border-left:0;"><i class="fa fa-arrows"></i></a>
									<a href="javascript:;" onclick="emoji.f.showDialog(this)" title="添加表情"><i class="fa fa-github-alt"></i> 添加表情</a>
									<a href="javascript:;" onclick="wxmenu.f.setAction(this)" title="设置此菜单动作"><i class="fa fa-pencil"></i> 设置动作</a>
									<a href="javascript:;" onclick="wxmenu.f.deleteMenu(this)" title="删除此菜单"><i class="fa fa-remove"></i> 删除</a>
								</div>
								<?php endforeach;?>
								<!-- subMenus -->
							</div>
						</td>
					</tr>
				<?php } ?>
			</tbody>
		</table>
		</form>
	</div>
	<div class="panel-footer">
		<a href="javascript:;" ng-click="addMenu();">添加菜单 <i class="fa fa-plus-circle" title="添加菜单"></i></a> &nbsp; &nbsp; &nbsp;  <span class="help-inline">可以使用 <i class="fa fa-arrows"></i> 进行拖动排序</span>
	</div>
</div>


<div class="panel panel-success" style = 'display:none;'>
	<div class="panel-heading">
		历史记录菜单 <span class="text-muted">最后一次编辑时间：暂无编辑记录 <b><a href="javascript:;" onclick="$('.history-body').fadeToggle();$('.history-foot').fadeToggle();">点击展示</a></b></span>
	</div>
	<div class="table-responsive history-body" style="display:none;">
		<table class="table table-hover">
			<tbody class="designer ui-sortable">
			<!-- ngRepeat: hmenu in hmenus -->
			</tbody>
		</table>
	</div>
	<div class="panel-footer history-foot" style="display:none;">
		<a href="javascript:;" ng-click="saveMenu('history');" class="btn btn-success">使用历史菜单</a>
	</div>
</div>



<div class="panel panel-default">
	<div class="panel-heading">
		操作 <span class="text-muted">设计好菜单后再进行保存操作</span>
	</div>
	<div class="panel-body">
		<div class="form form-horizontal">
			<div class="form-group">
				<div class="col-xs-12 col-sm-9 col-md-10 col-lg-10">
					<input type="button" value="保存菜单结构" class="btn btn-primary" ng-click="saveMenu();">
					<span class="help-block">菜单设计完成将在所有支持的公众号上生效. 成功保存当前菜单结构至公众平台后, 由于缓存可能需要在24小时内生效</span>
				</div>
			</div>
			<div class="form-group">
				<div class="col-xs-12 col-sm-9 col-md-10 col-lg-10">
					<input type="button" value="删除" class="btn btn-primary" ng-click="removeMenu();">
					<div class="help-block">清除自定义菜单</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div style = 'display:none'>
	<div id="dialog_action_html">
		<div class="modal-body">
			<label class="radio-inline">
				<input type="radio" name="ipt" onclick = 'javascript:wxmenu.f.switchAType();' value="url" class="action_type"> 链接
			</label>
			<label class="radio-inline">
				<input type="radio" name="ipt" onclick = 'javascript:wxmenu.f.switchAType();' value="click" class="action_type"> 触发关键字
			</label>
			<div class = 'moption_url hide_option_'>
				<hr>
				<div class="input-group">
					<input class="form-control ng-pristine ng-untouched ng-valid" id="ipt-url" type="text" ng-model="activeMenu.url">
					<div class="input-group-btn">
						<button class="btn btn-primary" id="search" ng-click="select_link()"><i class="fa fa-external-link"></i> 系统链接</button>
					</div>
				</div>
				<span class="help-block">指定点击此菜单时要跳转的链接（注：链接需加http://）</span>
				<span class="help-block"><strong>注意: 由于接口限制. 如果你没有网页oAuth接口权限, 这里输入链接直接进入微站个人中心时将会有缺陷(有可能获得不到当前访问用户的身份信息. 如果没有oAuth接口权限, 建议你使用图文回复的形式来访问个人中心)</strong></span>
			</div>
			<div class = 'moption_click hide_option_'>
				<hr>
				<div class="input-group">
					<input class="form-control ng-pristine ng-untouched ng-valid" id="ipt-forward" type="text" ng-model="activeMenu.forward">
					<div class="input-group-btn">
						<button class="btn btn-primary" id="search" ng-click="search()"><i class="fa fa-search"></i> 搜索</button>
					</div>
				</div>
				<div id="key-result" style="width:100%;position:absolute;top:55px;left:0px;display:none;z-index:10000">
				  <ul class="dropdown-menu" style="display:block;width:88%;"></ul>
				</div>
				<span class="help-block">指定点击此菜单时要执行的操作, 你可以在这里输入关键字, 那么点击这个菜单时就就相当于发送这个内容至系统系统</span>
				<span class="help-block"><strong>这个过程是程序模拟的, 比如这里添加关键字: 优惠券, 那么点击这个菜单是, 系统系统相当于接受了粉丝用户的消息, 内容为"优惠券"</strong></span>
			</div>
		</div>
	</div>
</div>
<script>
$(function(){
	wxmenu.f.init();
});
</script>
<style>
.sortable-placeholder{margin-left:80px;margin-top:20px;border:2px dotted #000;height:35px;diplay:block;width:220px}
</style>
